 <div id="register" class="login_wrapper">
    <section class="login_content">
      <form action="javascript:void(0);">
        <h1>Create Account</h1>
        <div>
          <input type="text" class="form-control" placeholder="请输入账号" required=""
                 v-model:value="user.userName"/>
        </div>
        <div>
          <input type="email" class="form-control" placeholder="请输入Email" required=""
                 v-model:value="user.email"/>
        </div>
        <div>
          <input type="password" class="form-control" placeholder="请输入密码" required=""
                 v-model:value="user.password"/>
        </div>
        <div>
          <a class="btn btn-default submit" href="javascript:void(0)"
             @click="register()">Submit</a>
        </div>

        <div class="clearfix"></div>

        <div class="separator">
          <p class="change_link">Already a member ?
            <a href="/login" class="to_register"> Log in </a>
          </p>

          <div class="clearfix"></div>
          <br />

          <div>
            <h1><i class="fa fa-paw"></i>  Spring Boot System</h1>
            <p>©2021 All Rights Reserved.  Spring Boot System use Bootstrap 3 template. Privacy and Terms</p>
          </div>
        </div>
      </form>
    </section>
</div>

 <script type="text/javascript">
   var userRegist=new Vue({
        el:"#register",
        data:{
          user:{
            email:"",
            userName:"",
            password:"",
          }
        },
        methods:{
          register:function () {
            if (this.user.userName==""){
              layer.msg("请输入用户名", {icon: 0});
              return;
            }else if (this.user.email==""){
              layer.msg("请输入邮箱", {icon: 0});
              return;
            }else if (this.user.password==""){
              layer.msg("请输入密码", {icon: 0});
              return;
            }
            var self=this;
            $.ajax({
              url:"/api/user",
              type:"post",
              contentType:"application/json",
              data:JSON.stringify(self.user),
              success:function (result) {
                if (result.status==200){
                  layer.msg(result.message, {icon: 0});
                  location.href="/login";
                }else {
                  /*icon: 0  0表示样式*/
                 layer.msg(result.message, {icon: 0});
                }
              },
              error:function (result) {
                layer.msg(result.responseText,{icon:0});
              }
            })
          },
          key:function (event) {
            if (event.keyCode==13){
              this.register();
            }
          }
        },
        created:function(){
          window.key=this.key;
        }
   });
 </script>